<template>
	<view class="content">
		<view class="header">
			<image class="logo" @click="goindex()" :src="_baseURL + setting.site_logo" mode=""></image>
			<view class="nologin" v-if="showinfonav">
				<view class="to-login" @click="gologin()">登录</view>
				<!-- <view class="com-btn" @click="goregister()">注册</view> -->
			</view>
			<view v-else class="after-login">
				<view class="balance">
					<image class="jinbi" src="../../static/img/jinbi.png" mode=""></image>
					<view class="yue">${{userinfo.money}}</view>
					<image @click="getrefresh()" class="shuaxin" :class="isrefresh ? 'ssssxuanzhuan':''"
						src="../../static/img/shuaxin.png" mode=""></image>
					<view class="qianbao">
						<image src="../../static/img/qianbao.png" mode=""></image>
					</view>
				</view>
				<view class="com-my" @click="gouserindex()">
					<image src="../../static/img/avatar.webp" mode=""></image>
				</view>
			</view>
		</view>
		<liuyuno-tabs ref="liuyuno" :tabData="tabs" :defaultIndex="defaultIndex" @tabClick='tabClick' />
		<view class="con">


			<view class="card-head"
				style="margin-top: 40rpx;margin-bottom: 24rpx;display: flex;align-items: center;justify-content: space-between;">
				<view class="chleft">
					<!-- <image class="gameicon" src="../../static/img/indexicon.png" mode=""></image> -->
					<view>游戏厂商</view>
				</view>
				<view class="" @click="back()">
					<svg t="1731146713276" class="icon" viewBox="0 0 1024 1024" version="1.1"
						xmlns="http://www.w3.org/2000/svg" p-id="64186" width="22" height="22">
						<path
							d="M512 0C229.0176 0 0 229.376 0 512c0 282.9824 229.0176 512 512 512 282.624 0 512-229.0176 512-512C1024 229.376 794.624 0 512 0z m221.8496 671.744c17.408 17.0496 17.408 45.056 0 62.464-8.5504 8.5504-19.8144 12.6464-31.0784 12.6464s-22.8864-4.096-31.3856-12.6464L512 574.8224 352.256 734.208c-17.0496 17.0496-45.056 17.0496-62.464 0-8.5504-8.5504-12.6464-20.1216-12.6464-31.3856s4.096-22.528 12.6464-31.0784l159.744-159.3856-159.744-159.744c-17.0496-17.408-17.0496-45.4144 0-62.464 17.408-17.408 45.4144-17.408 62.464 0l159.744 159.744 159.3856-159.744c17.408-17.408 45.4144-17.408 62.464 0 17.408 17.0496 17.408 45.056 0 62.464l-159.3856 159.744 159.3856 159.3856z"
							fill="#707070" p-id="64187"></path>
					</svg>
				</view>
			</view>

			<view class="swiper-item">
				<view class="info">
					<view class="left">
						<image src="../../static/img/game1.png" mode=""></image>
						<view>
							<view class="l-title">GFG GAMING</view>
							<view class="l-subtitle">183款游戏</view>
						</view>
					</view>
					<view class="left">
						<image src="../../static/img/game2.png" mode=""></image>
						<view>
							<view class="l-title">PG SOFT</view>
							<view class="l-subtitle">111款游戏</view>
						</view>
					</view>
					<view class="left">
						<image src="../../static/img/game3.png" mode=""></image>
						<view>
							<view class="l-title">PRAGMATIC PLAY</view>
							<view class="l-subtitle">349款游戏</view>
						</view>
					</view>
					<view class="left">
						<image src="../../static/img/game4.png" mode=""></image>
						<view>
							<view class="l-title">AG GAMING</view>
							<view class="l-subtitle">183款游戏</view>
						</view>
					</view>
					<view class="left">
						<image src="../../static/img/game5.png" mode=""></image>
						<view>
							<view class="l-title">ASTAR GAMING</view>
							<view class="l-subtitle">54款游戏</view>
						</view>
					</view>
					<view class="left">
						<image src="../../static/img/game6.png" mode=""></image>
						<view>
							<view class="l-title">Evolution GAMING</view>
							<view class="l-subtitle">224款游戏</view>
						</view>
					</view>
					<view class="left">
						<image src="../../static/img/game7.png" mode=""></image>
						<view>
							<view class="l-title">Spribe</view>
							<view class="l-subtitle">9款游戏</view>
						</view>
					</view>
					<view class="left">
						<image src="../../static/img/game8.png" mode=""></image>
						<view>
							<view class="l-title">T1 Games</view>
							<view class="l-subtitle">25款游戏</view>
						</view>
					</view>
					<view class="left" style="visibility: hidden;">
						<image src="../../static/img/game8.png" mode="w"></image>
						<view>
							<view class="l-title">T1 Games</view>
							<view class="l-subtitle">25款游戏</view>
						</view>
					</view>
				</view>

			</view>
			<view class="more-info" :class="showmore ? 'normal':'aftes'">

			</view>
			<view class="footer">
				<view class="service">
					<view class="serviceitem">
						<view class="sititle">支持/法律</view>
						<view class="cells">
							<view>常见问题</view>
							<view>负责任博彩</view>
							<view>公平公正</view>
							<view>服务条款</view>
							<view>关于我们</view>
						</view>
					</view>
				</view>
				<view class="line"></view>
				<view class="supper">
					<view class="sititle">社群入口</view>
					<view class="sup-icons">
						<image v-for="item in 7" src="../../static/img/bizhong.png" mode=""></image>
					</view>
				</view>
				<view class="supper">
					<view class="sititle">支持的币种</view>
					<view class="symbol-box">
						<image v-for="item in 7" src="../../static/img/bizhong.png" mode=""></image>
					</view>
				</view>
				<view class="rules">
					<view class="sititle">赞助和博彩责任</view>
					<view class="rule-icons">
						<image src="../../static/img/zanzhu1.png" mode=""></image>
						<image src="../../static/img/zanzhu2.png" mode=""></image>
						<image src="../../static/img/zanzhu3.png" mode=""></image>
						<image src="../../static/img/zanzhu4.png" mode=""></image>
						<image src="../../static/img/zanzhu5.png" mode=""></image>
						<image src="../../static/img/zanzhu6.png" mode=""></image>
					</view>
				</view>
				<view class="line"></view>
				<view class="copyright">
					<image :src="_baseURL + setting.site_logo" mode=""></image>
					<view> 太平洋娱乐，区块链游戏加密赌场，通过实施公平、公正的策略来满足全球数百万用户的需求。强调以用户为核心，太平洋娱乐 致力于保证游戏的透明度和公平性，同时提供一个持续的、充满乐趣的游戏平台。
					</view>
				</view>
			</view>
		</view>
		<view class="tabbars">
			<view class="tabber-item active" @click="changetabbars()">
				<view class="tiicon">
					<image class="tiicon1" src="../../static/tabbar/caidan.png" mode=""></image>
				</view>
				<view>菜单</view>
			</view>
			<view class="tabber-item" @click="goinvitation()">
				<view class="tiicon">
					<image class="tiicon2" src="../../static/img/caipiao.png" mode=""></image>
				</view>
				<view>彩票</view>
			</view>
			<view class="tabber-item tabber-item1" @click="goinvitation()">
				<view class="tiicon">
					<image class="tiicon2" src="../../static/img/tuandui.png" mode=""></image>
				</view>
				<view>团队</view>
			</view>
			<view class="tabber-item" @click="gorecharge()">
				<view class="tiicon">
					<image class="tiicon3" src="../../static/icon/23.png" mode=""></image>
				</view>
				<view>充值</view>
			</view>
			<view class="tabber-item" @click="gokefu()">
				<view class="tiicon">
					<image class="tiicon4" src="../../static/tabbar/liaotian.png" mode=""></image>
				</view>
				<view>聊天</view>
			</view>
		</view>
		<view class="popup" :class="[popups ? 'in':'out',lingorbai ? 'ling':'bai']" @touchstart="touchStart"
			@touchend="touchEnd" @touchmove.stop.prevent="movehandle()">
			<view class="menu-wrap">
				<image class="indexbg" src="../../static/img/indexbg.png" mode=""></image>
				<view class="link-items">
					<view class="link-item">
						<image src="../../static/icon/1.png" mode=""></image>
						<view>邀请好友</view>
					</view>
					<view class="link-item" @click="govipcenter()">
						<image src="../../static/icon/3.png" mode=""></image>
						<view>VIP俱乐部</view>
					</view>
					<view class="link-item" @click="gogame()">
						<image src="../../static/icon/2.png" mode=""></image>
						<view>游戏厂商</view>
					</view>
					<view class="link-item">
						<image src="../../static/icon/4.png" mode=""></image>
						<view>商务合作</view>
					</view>
					<view class="link-item">
						<image src="../../static/icon/5.png" mode=""></image>
						<view>活动优惠</view>
					</view>
				</view>
				<view class="online-service" @click="gokefu()">
					<image src="../../static/img/kefu.png" mode=""></image>
					<view>在线客服</view>
				</view>
			</view>
		</view>
		<view class="gonggao" v-if="gonggaoshow" @touchmove.stop.prevent="movehandle()">
			<view class="gonggaocon">
				<view class="Annmt">
					<view class="annmttext">
						<view class="annmttitle">官方公告</view>
						<view class="annmtbox">
							<swiper class="swipers" :indicator-dots="true" :autoplay="false" :interval="3000"
								:duration="1000" :circular="true" indicator-color="#ebedf0"
								indicator-active-color="#13db6f">
								<swiper-item v-for="(item,index) in gonggaolist" :key="index">
									<scroll-view scroll-y="true" class="swiper-item">
										<view v-html="item.rule_content"></view>
									</scroll-view>
								</swiper-item>
							</swiper>
						</view>
					</view>
					<view class="annmtknow" @click="gonggaoshow = false">我知道了</view>
				</view>
			</view>
		</view>
	</view>
</template>

<script>
	import liuyunoTabs from "@/components/liuyuno-tabs/liuyuno-tabs.vue";
	import {
		getuserinfo,
		activity_list,
		sysconfig
	} from '../../api/api.js'
	import { baseURL } from '../../api/http.js'
	export default {
		components: {
			liuyunoTabs
		},
		data() {
			return {
				tabs: [
					'首页',
					'电子',
					'真人',
					'彩票',
					'体育',
					'电竞',
					'捕鱼',
					'棋牌'
				],
				defaultIndex: 0,

				showmore: false,
				showinfonav: true,
				userinfo: [],
				isrefresh: false,
				popups: false,
				lingorbai: false,

				startX: 0,

				gonggaoshow: false,
				gonggaolist: [],
				
				_baseURL: baseURL,
				setting: []
			}
		},
		onLoad() {
			if (uni.getStorageSync('userinfo')) {
				this.userinfo = JSON.parse(uni.getStorageSync('userinfo'))
			}
			if (uni.getStorageSync('token')) {
				this.showinfonav = false
				this.getuserinfo()
			}
			this.getgonggao()
			this.getsysconfig()
			if (uni.getStorageSync('indexgonggaoshow') == 0) {
				this.gonggaoshow = true;
				uni.setStorageSync('indexgonggaoshow', 1)
			}
		},
		methods: {
			goindex() {
				uni.reLaunch({
					url: '/pages/index/index'
				})
			},
			back(){
				uni.reLaunch({
					url:'/pages/index/index'
				})
			},
			gogame() {
				uni.navigateTo({
					url: '/pages/gameList/gameList'
				})
			},
			open() {
				let that = this;
				this.popups = true;
				setTimeout(function() {
					that.lingorbai = true
				}, 700)
			},
			touchStart: function(e) {
				if (e.touches.length == 1) {
					//设置触摸起始点水平方向位置
					this.startX = e.touches[0].clientX;
				}
			},
			touchEnd: function(e) {
				let that = this;
				if (e.changedTouches.length == 1) {
					//手指移动结束后水平位置
					var endX = e.changedTouches[0].clientX;
					let diff = endX - this.startX;
					if (Math.abs(diff) > 20) {
						if (diff > 0) {
							console.log("左滑...");
						} else {
							console.log("右滑...");
							that.popups = false;
							setTimeout(function() {
								that.lingorbai = false
							}, 700)
						}
					}
				}
			},
			movehandle() {
				return true
			},

			changetabbars() {
				let pages = getCurrentPages()
				if (pages[pages.length - 1].$page.fullPath == '/pages/index/index') {
					this.open()
				} else {
					uni.reLaunch({
						url: '/pages/index/index'
					})
				}
			},
			goinvitation() {
				uni.navigateTo({
					url: '/pages/index/invitation'
				})
			},
			gohuodong() {
				uni.navigateTo({
					url: '/pages/active/activeList'
				})
			},
			gorecharge(){
				uni.navigateTo({
					url:'/pages/active/activeList'
				})
			},
			gokefu() {
				window.open(this.setting.service_link)
			},
			govipcenter() {
				uni.navigateTo({
					url: '/pages/vip/center'
				})
			},

			tabClick(e) {
				let that = this;
				if (that.popups) {
					that.popups = false;
					setTimeout(function() {
						that.lingorbai = false
					}, 700)
				}
			},
			changetab(e) {
				this.$refs['liuyuno'].tabClick(e)
			},
			getrefresh() {
				let that = this;
				this.isrefresh = true;
				setTimeout(function() {
					that.isrefresh = false;
				}, 1000)
				this.getuserinfo();
			},
			getuserinfo() {
				getuserinfo().then(res => {
					if (res.data.status.errorCode == 0) {
						uni.setStorageSync('userinfo', JSON.stringify(res.data.data.member))
						this.userinfo = res.data.data.member
					} else {
						uni.showToast({
							title: res.data.status.msg,
							icon: 'error',
							duration: 2000
						});
					}
				}).catch(err => {
					console.log(err)
				})
			},
			getgonggao() {
				activity_list().then(res => {
					if (res.data.status.errorCode == 0) {
						this.gonggaolist = res.data.data.data
					} else {
						uni.showToast({
							title: res.data.status.msg,
							icon: 'error',
							duration: 2000
						});
					}
				}).catch(err => {
					console.log(err)
				})
			},
			getsysconfig() {
				sysconfig().then(res => {
					if (res.data.status.errorCode == 0) {
						this.setting = res.data.data
					} else {
						uni.showToast({
							title: res.data.status.msg,
							icon: 'error',
							duration: 2000
						});
					}
				}).catch(err => {
					console.log(err)
				})
			},
			gologin() {
				uni.navigateTo({
					url: '/pages/login/login'
				})
			},
			goregister() {
				uni.navigateTo({
					url: '/pages/login/register'
				})
			},
			gouserindex() {
				uni.navigateTo({
					url: '/pages/user/index'
				})
			}
		}
	}
</script>

<style scoped>
	* {
		box-sizing: border-box;
	}

	/deep/ *::-webkit-scrollbar {
		display: none;
	}

	/deep/ * {
		-ms-overflow-style: none;
		/* IE and Edge */
		scrollbar-width: none;
		/* Firefox */
	}

	.content {
		width: 100%;
		min-height: 100vh;
		background: #212125;
	}

	.header {
		width: 100%;
		height: 100rpx;
		padding-right: 24rpx;
		padding-left: 39rpx;
		display: flex;
		justify-content: space-between;
		align-items: center;
	}

	.logo {
		width: 100rpx;
		height: 80rpx;
	}

	.nologin,
	.after-login {
		display: flex;
		justify-content: space-between;
		align-items: center;
	}

	.to-login {
		word-break: break-all;
		text-align: center;
		font-weight: 700;
		margin-right: 40rpx;
		font-size: 26rpx;
		color: #fff;
		padding-top: 8rpx;
	}

	.com-btn {
		display: flex;
		justify-content: center;
		align-items: center;
		min-width: 204rpx;
		height: 64rpx;
		background: #fee619;
		box-shadow: 0 8rpx 0 0 #d9a715, inset 0 0 24rpx 6rpx rgba(243, 48, 48, .34), 0 4rpx 12rpx 6rpx rgba(255, 123, 1, .34);
		border-radius: 12rpx;
		font-weight: 700;
		padding-top: 8rpx;
		font-size: 26rpx;
		color: #1c1e22;
		word-break: break-all;
		text-align: center;
	}

	.con {
		width: 100%;
		height: calc(100vh - 302rpx);
		overflow-y: scroll;
		padding: 24rpx 20rpx 0 20rpx;
	}

	.swiper-item {
		width: 100%;
		/* height: 288rpx; */
		border-radius: 12rpx;
	}

	.swiper-item image {
		width: 100%;
		height: 288rpx;
		border-radius: 12rpx;
	}

	.games {
		width: 100%;
		margin-top: 56rpx;
	}

	.card-head {
		width: 100%;
		display: flex;
		justify-content: space-between;
		align-items: center;
		margin-bottom: 10rpx;
	}

	.chleft {
		flex: 1;
		display: flex;
		justify-content: flex-start;
		align-items: center;
	}

	.gameicon {
		width: 38rpx;
		height: 38rpx;
		margin-right: 12rpx;
	}

	.chleft view {
		font-size: 36rpx;
		font-weight: 700;
		color: #fff;
	}

	/deep/ .uni-scroll-view-content {
		display: flex;
		justify-content: flex-start;
		align-items: center;
		width: fit-content;
	}

	.items {
		width: 220rpx;
		height: 308rpx;
		border-radius: 16rpx;
		overflow: hidden;
		margin-right: 10rpx;
	}

	.items image {
		width: 100%;
		height: 100%;
	}

	.chright {
		font-size: 24rpx;
		color: #36ba73;
	}

	/deep/ .siwper1 .uni-swiper-slide-frame {
		width: 580rpx !important;
	}

	.changshang {
		width: 580rpx !important;
	}

	.changshang .swiper-item {
		width: 564rpx;
		padding: 18rpx 10rpx 12rpx 10rpx;
		height: 400rpx;
		background: #17181b;
		border-radius: 10rpx;
	}

	.info {
		display: flex;
		justify-content: space-between;
		align-items: center;
		flex-wrap: wrap;
	}

	.left {
		/* flex: 1; */
		margin: 20rpx 10rpx;
		display: flex;
		flex-direction: column;
		justify-content: flex-start;
		align-items: center;
		background-color: #161a1d;
		width: 30%;
		padding: 40rpx 0;
	}

	.left image {
		width: 144rpx;
		height: 50rpx;
		margin-right: 20rpx;
	}

	.l-title {
		font-size: 22rpx;
		color: #a6b2c0;
		line-height: 28rpx;
		margin: 30rpx 0;
	}

	.l-subtitle {
		font-size: 22rpx;
		/* color: #97a8b8; */
		line-height: 28rpx;
		color: #fff;
		background-color: #21262B;
		padding: 10rpx 10rpx;
		text-align: center;
	}

	.info .right {
		width: 32rpx;
		height: 32rpx;
		margin-right: 28rpx;
	}

	.infoscon {
		width: 100%;
		display: flex;
		justify-content: space-between;
		align-items: center;
		flex-wrap: wrap;
		margin-top: 18rpx;
	}

	.infoscon image {
		width: 166rpx;
		height: 120rpx;
	}

	.infoscon image:nth-child(-n+3) {
		margin-bottom: 10rpx;
	}

	.content-wrap {
		width: 100%;
		padding: 40rpx 34rpx 0 34rpx;
	}

	.more-info {
		position: relative;
		overflow: hidden;
	}

	.more-info.normal {
		background-color: #2d3035;
	}

	.more-info.aftes::after {
		content: "";
		position: absolute;
		top: 0;
		right: 0;
		width: 100%;
		height: 100%;
		background: url('../../static/img/more.png') repeat top;
		background-size: 100% 100%;
	}

	.main-title {
		margin-bottom: 28rpx;
		color: #fff;
		font-size: 48rpx;
		font-weight: 500;
		line-height: normal;
	}

	.contentcon {
		width: 100%;
		padding: 24rpx 20rpx 0 20rpx;
		text-align: justify;
		padding-bottom: 154rpx;
	}

	.contentcon.close {
		overflow: hidden;
		height: 396rpx;
		padding-bottom: 0;
		filter: brightness(.5);
	}

	.contentcon.expande {
		overflow: auto;
		height: auto;
	}

	.ccitem {
		margin-bottom: 40rpx;
		color: #b7bbcc;
		font-size: 28rpx;
	}

	.ccitem h5 {
		color: #fff;
		font-size: 40rpx;
		margin-bottom: 22rpx;
	}

	.ccitem h3 {
		color: #fee01a;
		font-size: 28rpx;
	}

	.expande-button-wrap {
		position: absolute;
		bottom: 22rpx;
		left: 50%;
		transform: translate(-50%);
		z-index: 2;
	}

	.expande-button {
		width: 208rpx;
		height: 80rpx;
		line-height: 80rpx;
		font-size: 24rpx;
		color: #fff;
		border-radius: 6rpx;
		text-align: center;
		background: #3f434d;
	}

	.footer {
		width: 100%;
		padding: 56rpx 0 70rpx 0;
		background: #17181b;
	}

	.service {
		width: 100%;
		display: flex;
		justify-content: flex-start;
		padding: 0 32rpx;
	}

	.serviceitem {
		width: 100%;
	}

	.sititle {
		font-weight: 700;
		color: #fff;
		margin-bottom: 26rpx;
		font-size: 36rpx;
	}

	.cells {
		width: 100%;
		display: flex;
		justify-content: space-between;
		align-items: center;
	}

	.cells view {
		flex: 1;
		color: #a6b2c0;
		text-align: center;
		margin-right: 10rpx;
		font-size: 24rpx;
	}

	.cells view:last-child {
		margin-right: 0;
	}

	.line {
		background: #25272b;
		margin: 50rpx 0;
		height: 2rpx;
		width: 100%;
	}

	.supper {
		width: 100%;
		padding: 0 32rpx;
	}

	.sup-icons,
	.symbol-box {
		margin-bottom: 44rpx;
		display: flex;
		justify-content: space-between;
		align-items: center;
	}

	.sup-icons image {
		width: 80rpx;
		height: 80rpx;
	}

	.symbol-box {
		padding: 0 10rpx;
	}

	.symbol-box image {
		width: 56rpx;
		height: 56rpx;
	}

	.rules {
		width: 100%;
		margin-top: 66rpx;
		margin-bottom: 28rpx;
		padding: 0 32rpx;
	}

	.rule-icons {
		display: grid;
		grid-template-areas:
			"a b c"
			"d e f";
		gap: 48rpx 26rpx;
		margin-bottom: 64rpx;
	}

	.rule-icons image:nth-child(1) {
		width: 172rpx;
		height: 36rpx;
		grid-area: a;
		place-self: center flex-start;
	}

	.rule-icons image:nth-child(2) {
		width: 88rpx;
		height: 84rpx;
		grid-area: b;
		place-self: center;
	}

	.rule-icons image:nth-child(3) {
		width: 208rpx;
		height: 60rpx;
		grid-area: c;
		place-self: center flex-end;
	}

	.rule-icons image:nth-child(4) {
		width: 134rpx;
		height: 66rpx;
		grid-area: d;
		place-self: center flex-start;
	}

	.rule-icons image:nth-child(5) {
		width: 72rpx;
		height: 104rpx;
		grid-area: e;
		place-self: center;
	}

	.rule-icons image:nth-child(6) {
		width: 232rpx;
		height: 58rpx;
		grid-area: f;
		place-self: center flex-end;
	}

	.copyright {
		width: 100%;
		padding: 0 32rpx;
	}

	.copyright image {
		width: 100rpx;
		height: 80rpx;
	}

	.copyright view {
		color: #a6b2c0;
		margin-top: 30rpx;
		font-size: 22rpx;
		line-height: 38rpx;
	}

	.balance {
		display: flex;
		justify-content: space-between;
		align-items: center;
		min-width: 160rpx;
		max-width: 400rpx;
		height: 70rpx;
		padding-left: 32rpx;
		background: #14161a;
		border-top-left-radius: 10rpx;
		border-bottom-left-radius: 10rpx;
	}

	.jinbi {
		width: 32rpx;
		height: 28rpx;
	}

	.yue {
		font-size: 30rpx;
		padding-left: 10rpx;
		font-weight: 600;
		color: #fff;
	}

	.shuaxin {
		width: 30rpx;
		height: 30rpx;
		margin-left: 22rpx;
		margin-right: 16rpx;
	}

	.ssssxuanzhuan {
		animation: rotatefresh 1s;
	}

	@keyframes rotatefresh {
		from {
			transform: rotate(0deg);
		}

		to {
			transform: rotate(360deg);
			transition: all 0.6s;
		}
	}

	.qianbao {
		width: 72rpx;
		height: 66rpx;
		border-top-right-radius: 10rpx;
		border-bottom-right-radius: 10rpx;
		display: flex;
		justify-content: center;
		align-items: center;
		background-color: #fee619;
		box-shadow: 0 2rpx 0 0 #d9a715, inset 0 0 24rpx 6rpx rgba(243, 48, 48, .34), 0 4rpx 12rpx 6rpx rgba(255, 123, 1, .34);
	}

	.qianbao image {
		width: 30rpx;
		height: 30rpx;
	}

	.com-my {
		width: 70rpx;
		height: 78rpx;
		display: flex;
		justify-content: center;
		align-items: center;
		margin-left: 30rpx;
		padding-top: 8rpx;
		border-radius: 50%;
		overflow: hidden;
	}

	.com-my image {
		width: 70rpx;
		height: 70rpx;
	}

	.popup {
		width: 100vw;
		height: calc(100vh - 190rpx);
		overflow: hidden;
		position: fixed;
		top: 190rpx;
		left: 0;
		z-index: 999;
		background-color: #202125;
		border-top: 2rpx solid #17181b;
	}

	.popup.in {
		animation: leftru .7s ease;
		animation-fill-mode: forwards;
	}

	.popup.ling {
		translate: 0%;
	}

	.popup.out {
		animation: leftchu .7s ease;
		animation-fill-mode: forwards;
	}

	.popup.bai {
		translate: -100%;
	}

	@keyframes leftru {
		0 {
			translate: -100%;
		}

		100% {
			translate: 0%;
		}
	}

	@keyframes leftchu {
		0 {
			translate: 0%;
		}

		100% {
			translate: -100%;
		}
	}

	.menu-wrap {
		padding: 26rpx 24rpx 140rpx 24rpx;
	}

	.indexbg {
		width: 100%;
		height: 168rpx;
	}

	.link-items {
		padding: 0 32rpx;
		margin-top: 30rpx;
		border-radius: 6rpx;
		background: #2e3035;
	}

	.link-item {
		height: 94rpx;
		display: flex;
		justify-content: flex-start;
		align-items: center;
	}

	.link-item image,
	.online-service image {
		width: 36rpx;
		height: 32rpx;
	}

	.link-item view,
	.online-service view {
		padding-left: 32rpx;
		font-size: 28rpx;
		color: #fff;
	}

	.online-service {
		height: 96rpx;
		margin-top: 8rpx;
		padding: 0 32rpx;
		border-radius: 6rpx;
		background: #2e3035;
		display: flex;
		justify-content: flex-start;
		align-items: center;
	}

	.gonggao {
		position: fixed;
		top: 0;
		left: 0;
		z-index: 2001;
		width: 100%;
		height: 100%;
		background-color: rgba(0, 0, 0, .7);
	}

	.gonggaocon {
		width: 628rpx;
		height: 1054rpx;
		position: fixed;
		top: 50%;
		left: 50%;
		transform: translate3d(-50%, -50%, 0);
		display: flex;
		flex-direction: column;
		background-size: 100% 100% !important;
		background-image: url('../../static/img/gonggao.jpeg');
	}

	.Annmt {
		flex: 1;
		padding: 340rpx 0 48rpx 0;
		height: calc(100vh - 374rpx);
		overflow-y: scroll;
	}

	.annmttext {
		height: calc(100% - 80rpx);
	}

	.annmttitle {
		font-weight: 700;
		text-align: center;
		font-size: 36rpx;
		margin-bottom: 36rpx;
		color: #fff;
	}

	.annmtbox {
		width: 520rpx;
		height: 440rpx;
		font-size: 24rpx;
		color: #fff;
		margin: 0 auto;
		overflow: hidden visible;
	}

	.annmtbox .swipers {
		height: 440rpx;
	}

	.annmtbox .swiper-item {
		width: 100%;
		height: 390rpx;
	}

	/deep/ .annmtbox .uni-scroll-view-content {
		display: block;
	}

	/deep/ .annmtbox .uni-swiper-dot {
		width: 12rpx;
		height: 12rpx;
	}

	.annmtknow {
		width: 548rpx;
		height: 76rpx;
		margin: 0 auto;
		font-size: 30rpx;
		font-weight: 700;
		color: #000;
		border-radius: 12rpx;
		background: #fee619;
		box-shadow: 0 8rpx 0 0 #d9a715, inset 0 0 24rpx 6rpx rgba(243, 48, 48, .34), 0 4rpx 12rpx 6rpx rgba(255, 123, 1, .34);
		display: flex;
		justify-content: center;
		align-items: center;
	}

	.tabbars {
		position: fixed;
		display: flex;
		width: 100%;
		height: calc(112rpx + env(safe-area-inset-bottom));
		background: #1e1f23;
		bottom: 0;
		left: 0;
		z-index: 888;
		padding-bottom: env(safe-area-inset-bottom);
	}

	.tabber-item {
		display: flex;
		justify-content: center;
		align-items: center;
		flex-direction: column;
		height: 112rpx;
		position: relative;
		width: 25%;
	}

	.tiicon {
		display: flex;
		justify-content: center;
		align-items: center;
		height: 40rpx;
	}

	.tiicon1 {
		width: 32rpx;
		height: 24rpx;
	}

	.tiicon2 {
		width: 36rpx;
		height: 36rpx;
	}

	.tiicon3 {
		width: 38rpx;
		height: 34rpx;
	}

	.tiicon4 {
		width: 34rpx;
		height: 32rpx;
	}

	.tabber-item view {
		font-size: 22rpx;
		color: #a6aeb9;
		margin-top: 10rpx;
	}

	.tabber-item.active view {
		color: #fff;
	}
	
	.tabber-item1::before{
		content: "";
		position: absolute;
		z-index: 2;
		top: -33%;
		background: #1e1f23;
		left: 50%;
		width: 110rpx;
		height: 106rpx;
		border-radius: 50%;
		transform: translate(-50%) !important;
		display: flex;
		justify-content: center;
		align-items: center;
		flex-direction: column;
		flex-wrap: nowrap;
	}
	.tabber-item1 .tiicon2{
		position: relative;
		width: 76rpx;
		height: 76rpx;
		margin-top: -36rpx;
		z-index: 3;
	}
</style>